<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			*{
			padding: 0;
			margin: 0;
			}
			div#a1 {
				padding: 30px;
				position: absolute;
			}
			
			ul.a2 {
				margin: 0px;
				padding: 0px;
				position: absolute;
				bottom: 45px;
				right: 290px;
			}
			
			li {
				text-align: center;
				height: 20px;
				width: 20px;
				color: white;
				list-style: none;
				float: left;
				background: #3E3E3E;
				border-radius: 25px;
				margin: 5px;
			}
			
			ul.a2 li:hover {
				color: white;
				background: #F27B05;
				cursor: pointer;
			}
		</style>
	</head>

	<body>
		<div id="a1">
			<img src="../img/focus.jpg" />
			<ul class="a2">
				<li>1</li>
				<li>2</li>
				<li>3</li>
				<li>4</li>
				<li>5</li>
			</ul>
		</div>

	</body>

</html>